<template>
  <div style="flex:1;line-height: 60px;">
    <div style="display: inline-block;float: left;font-size: 25px;">
      <span :class="collapseBtnClass" style="cursor:pointer" @click="collapse"></span>
    </div>
    <div class="block" :key="size" style="float: right;display: flex">
      <div style="display: inline-block;">
        <el-dropdown>
          <i class="el-icon-caret-bottom" style="margin-right: 15px"></i>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>个人资料</el-dropdown-item>
            <el-dropdown-item>布局设置</el-dropdown-item>
            <el-dropdown-item><i @click="loginOut">退出登录</i></el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
      <div style="display: inline-block;margin-top:10px;">
        <el-avatar shape="square" :size="size" :src="squareUrl"></el-avatar>
      </div>
    </div>
  </div>
</template>

<script>
import request from "../utils/request";

export default {
  name: "Header",
  props: {
    collapseBtnClass:String,
    collapse:Boolean,
    squareUrl:String,
  },
  methods:{
    loginOut:function(){//退出
      console.log("ssss");
      request.get("/videoWeb/loginOut",{

      }).then(res =>{
        this.$router.push({path:"/login"});
      })
    },
  }
}
</script>

<style scoped>

</style>